﻿@model SMECustomerWebsite.Models.ViewModels.ProductHandbook.ProductHandbookProductDetailViewModel
<ul id="menu_product_handbook_detail" class="nav nav-tabs bar_tabs sme-tabs" role="tablist">
    <li role="presentation" class="active">
        @Html.ActionLink(@SMECustomerWebsite.Core.Resources.Resource.ProHandbookProDetailInfoTab, "ProductDetail", "ProductHandbook", new { productid = Request.QueryString["productid"] }, null)
    </li>

    <li role="presentation" class="">
        @Html.ActionLink(@SMECustomerWebsite.Core.Resources.Resource.ProHandbookProDetailChecklistTab, "Checklist", "ProductHandbook", new { productid = Request.QueryString["productid"] }, null)
    </li>

</ul>

<div class="row">
    <div class="col-md-12">
        <div class="x_panel">
            <div class="x_title">
                <h2>PRODUCT INFO</h2>
                <ul class="nav navbar-right panel_toolbox">
                    <li>
                        <a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                    </li>
                </ul>
                <div class="clearfix"></div>
            </div>
            <div class="x_content">
                <div class="" role="tabpanel" data-example-id="togglable-tabs">
                    <ul id="myTab" class="nav nav-tabs bar_tabs sme-tabs" role="tablist">
                        @if (Model.ProductDetail.Overview != null)
                        {
                            <li role="presentation" class="active">
                                <a href="#tab_content1" id="home-tab" role="tab" data-toggle="tab" aria-expanded="true">Overview</a>
                            </li>
                        }
                        @if (Model.ProductDetail.Condition != null)
                        {

                            <li role="presentation" class="">
                                <a href="#tab_content2" role="tab" id="profile-tab" data-toggle="tab" aria-expanded="false">Condition</a>
                            </li>
                        }
                        @if (Model.ProductDetail.Document != null)
                        {
                            <li role="presentation" class="">
                                <a href="#tab_content3" role="tab" id="profile-tab2" data-toggle="tab" aria-expanded="false">Document</a>
                            </li>
                        }
                        @if (Model.ProductDetail.Xselling != null)
                        {
                            <li role="presentation" class="">
                                <a href="#tab_content4" role="tab" id="profile-tab3" data-toggle="tab" aria-expanded="false">Cross Selling</a>
                            </li>

                        }
                    </ul>
                    <div id="myTabContent" class="tab-content">
                        @if (Model.ProductDetail.Overview != null)
                        {
                            <div role="tabpanel" class="tab-pane fade active in" id="tab_content1" aria-labelledby="home-tab">
                                @Html.Raw(HttpUtility.HtmlDecode(Model.ProductDetail.Overview))
                            </div>
                        }
                        @if (Model.ProductDetail.Condition != null)
                        {
                            <div role="tabpanel" class="tab-pane fade" id="tab_content2" aria-labelledby="profile-tab">
                                @Html.Raw(HttpUtility.HtmlDecode(Model.ProductDetail.Condition))
                            </div>
                        }
                        @if (Model.ProductDetail.Document != null)
                        {
                            <div role="tabpanel" class="tab-pane fade" id="tab_content3" aria-labelledby="profile-tab">
                                @Html.Raw(HttpUtility.HtmlDecode(Model.ProductDetail.Document))
                            </div>
                        }
                        @if (Model.ProductDetail.Xselling != null)
                        {
                            <div role="tabpanel" class="tab-pane fade" id="tab_content4" aria-labelledby="profile-tab">
                                @Html.Raw(HttpUtility.HtmlDecode(Model.ProductDetail.Xselling))
                            </div>
                        }
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
